<template>
  <j-modal
    :title="title"
    :width="800"
    :visible="visible"
    :maskClosable="false"
    :ok-button-props="{ props: { disabled: disableSubmit } }"
    :fullscreen="true"
    @close="close"
    cancelText="关闭"
  >
    <div style="margin: 0 auto" :class="{ isCheck: isCheck }">
      <a-form-model ref="form" :rules="validatorRules" :model="model">
        <table class="table table-striped table-bordered" align="center" valign="center">
          <tr>
            <td class="column title" colspan="12">基本信息</td>
          </tr>
          <tr>
            <td class="column" colspan="2">疑点名称</td>
            <td class="value" colspan="10">
              <a-form-model-item label="" prop="ydmc">
                <a-input :disabled="disableSubmit" v-model="model.ydmc" placeholder="请输入"></a-input>
              </a-form-model-item>
            </td>
          </tr>
          <tr>
            <td class="column" colspan="2">疑点内容</td>
            <td class="value" colspan="10">
              <a-textarea
                placeholder="请输入"
                :disabled="disableSubmit"
                allow-clear
                :auto-size="{ minRows: 3, maxRows: 3 }"
                v-model="model.ydnr"
              />
            </td>
          </tr>
          <tr>
            <td class="column" colspan="2">法规制度</td>
            <td class="value" colspan="10">
              <a-textarea
                placeholder="请输入"
                :disabled="disableSubmit"
                allow-clear
                :auto-size="{ minRows: 3, maxRows: 3 }"
                v-model="model.fgzd"
              />
            </td>
          </tr>
          <tr>
            <td class="column" colspan="2">附件</td>
            <td class="value" colspan="10" style="position: relative">
              <ZUpload
                :isShow="disableSubmit"
                ref="fileUpload"
                :fileid="model.fileId"
                @uploadFile="uploadFile"
              ></ZUpload>
            </td>
          </tr>
        </table>
      </a-form-model>
    </div>
    <!-- table区域-end -->
  </j-modal>
</template>
<script>
  import {httpAction, getAction} from '@/api/manage'
  import ZUpload from '../../components/ZUpload'
  import store from '@/store/'

  export default {
    name: 'SysPositionModal',
    components: {
      ZUpload,
    },
    data() {
      return {
        disableSubmit: false,
        title: '新增风险台账',
        visible: false,
        isCheck: false,
        model: {},
        url: {
          add: '/sjcg/sjWorkZtfaEveRisk/addRisk',
          edit: '/sjcg/sjWorkZtfaEveRisk/editRisk'
        },
        dataSource: [],
        validatorRules: {
          name: [{required: true, message: '请选择!'}],
        },
      }
    },
    created() {
    },
    methods: {
      add() {
        this.model = {}
        this.visible = true
      },
      check(record) {
        this.model = Object.assign({}, record)
        this.visible = true
      },
      edit(record) {
        this.model = Object.assign({}, record)
        this.visible = true
      },
      close(isSubmit) {
        if (isSubmit) {
          this.saveData()
        } else {
          this.visible = false
        }
      },
      saveData() {
        this.$refs.form.validate((valid) => {
          if (valid) {
            this.$refs.fileUpload.saveFile('fxgl')
          } else {
            return false
          }
        })
      },
      uploadFile(id) {
        let url, type
        if (!this.model.id) {
          url = this.url.add
          type = 'post'
        } else {
          url = this.url.edit
          type = 'put'
        }
        this.model.fileId = id
        httpAction(url, this.model, type).then((res) => {
          if (res.success) {
            this.$message.success(res.message)
            this.$emit('ok')
            this.visible = false
          } else {
            console.log(res)
          }
        })
      },
    },
  }
</script>

<style lang='less' scoped>
  @import '../../css/checkAndEdit.less';

  table {
    table-layout: fixed !important;
  }
</style>
